<template>
    <div id="app">
        <app-header v-bind:seller="seller">

        </app-header>

        <div class="tab border-1px">
            <div class="tab-item">
                <router-link to="/goods">商品</router-link>
            </div>
            <div class="tab-item">
                <router-link to="/ratings">评论</router-link>
            </div>
            <div class="tab-item">
                <router-link to="/seller">商家</router-link>
            </div>
        </div>

        <router-view :seller="seller"></router-view>

    </div>
</template>

<script>
    import header from './components/header/header.vue';
    export default {
        name: 'App',
        components:{
            'app-header': header
        },
        created() {
            this.$http.get('/api/seller').then((res) => {
                if(res.data.code==1){
                	this.seller=res.data.data;
                }
                console.log(this.seller)
            });
        },
        data() {
            return {
                seller: {}
            }
        }
    }
</script>


<style  lang="stylus" rel="stylesheet/stylus">
    @import "./common/stylus/index.styl"
    #app
        .tab
            display flex
            width 100%
            height 40px
            line-height 40px
            //border-bottom 1px solid rgba(7,17,27,0.1)
            border-1px(rgba(7,17,27,0.1))
            .tab-item
                text-align center
                flex 1
                &>a
                    display block
                    font-size 14px
                    color rgb(77,85,93)
                    &.active
                        color rgb(240,20,20)


</style>
